我打算把Jeremy McPeak所做的JavaScript Design Patterns影片看完並筆記

因為鐵人賽只剩幾天了，我先試寫第一篇，明天不太可能生出下一篇，之後會寫在自己的部落格裡

因為目前(應該說前一個)的案子是寫成pattern的模式，不過說實在的，我連他是不是pattern我都不是很確定

今天code review時同事說的我也都聽不懂，

目前自己已經能寫出公司開出的需求，但比較大型寫成OO或者說pattern形式的需求我完全不得其門而入阿

我甚至對於js的OO是不是等於pattern，甚至是目前公司那些我覺得很難很龐大系統化的code是不是就叫OO或patern我也不是很確定

是時候該拿起學校畢業後就沒在做的筆記本了!

01 JavaScript Design Patterns: Introduction

http://youtu.be/mG20htjwoBY?list=PLrzrNeNx3kNHsaPfrpPo0AlW-MhJE6gOA

大致就是前言，總之這影片就是要來教你一些js design pattern的基礎
為何要design pattern，就是他能reusable, 其實就是oo的優點啦，同一件事寫成pattern重覆使用就好了，不要一直重寫
不適合begginer，最好有javascript與javascript orientation的概念再來看

02 Creational Patterns Creational Patterns

https://www.youtube.com/watch?v=LjIWRvOL7aM&list=PLrzrNeNx3kNHsaPfrpPo0AlW-MhJE6gOA&index=10

在開始說pattern前，要先來看怎麼建立一個物件，有兩種：

var obj = {};
var obj = new Object();   //(不建議此種，畢竟上面寫法比較短，也比較沒有其他意外?)

艾：記得之前上保哥的angular，當時建議不要隨便用new的方式，但我並不知道原因...

我們把資料存進object(物件)可以使用「property屬性」

有許多方法，以下是syntex：

1. 用「點dot」

var obj = {};     //先建立出一個物件叫obj
obj.firstName = "Jeremy";   //給予obj物件的firstName(property屬性)一個值

2. 用「方括號Square Brackets」

 var obj = {};    //先建立出一個物件叫obk
 obj["lastName"] = "McPeak";   //給予obj物件的lastName(property屬性)一個值
 //使用字串為key

這兩種可以互動, 如果我現在要取得剛剛存的值：

var obj = {};
obj.firstName = "Jeremy";
obj["lastName"] = "McPeak";
var firstName = obj["firstName"];  //可用方括號
var lastName = obj.lastName;  //可用點

不過方括號比較彈性，因為方框內的string可以有空格["last Name"]也可以使用保留字(像["new"], ["true"], ["false"]，但請三思)

要創造property還可以使用defineProperty，但這是ECMAScript5，並非所有browser支援(eg IE8)
裡面有5個argument，以下只是單純舉例，但不完整，要自行再查過:

Object.defineProperty(obj, "country", {
        value: "USA",
})
Object.defineProperties(obj, {
        twitter:{
            value: "jwmcpeak"
        },
        email:{
            value: "jwmcpeak@wdonline.com"
        }
})

總之defineProperty跟defineProperties method 可以提供很多control在創建時給予很多property
一般來說點與方括號的創建物件(object)屬性(property)已經很夠用，但這是指物件已經產生後你想再加屬性進去的狀況
如果早就知道屬性, 也知道要給予什麼值，那麼可以在創建物件時就寫入
JavaScript 1.2 版本支援的物件實體語法（Object Literal)

var obj = {
  firstName: "Jeremy",
  lastName: "McPeak"
};

create object也可以使用create mehode，這是ECMAScript5，第三課將會講解